<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns:th="http://www.thymeleaf.org">

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

		<title>购物车页面</title>

		<link th:href="@{/static/assets/css/amazeui.css}" rel="stylesheet" type="text/css" />
		<link th:href="@{/static/basic/css/demo.css}" rel="stylesheet" type="text/css" />
		<link th:href="@{/static/css2/cartstyle.css}" rel="stylesheet" type="text/css" />
		<link th:href="@{/static/css2/optstyle.css}" rel="stylesheet" type="text/css" />

		<script type="text/javascript" th:src="@{js2/jquery.js}"></script>
		<!--layui样式-->
		<link rel="stylesheet" type="text/css" th:href="@{/static/lib/layui-v2.6.3/css/layui.css}"/>
		<script type="text/javascript" th:src="@{/static/lib/jquery-3.4.1/jquery-3.4.1.min.js}"></script>
		<script type="text/javascript" th:src="@{/static/lib/layui-v2.6.3/layui.js}"></script>

	</head>

	<body>

	<div class="am-container header">
		<ul class="message-l">
			<div class="topMessage">
				<div class="menu-hd">
					<a href="/login1/login" target="_top" class="h">亲，请登录</a>
					<a href="/login1/enroll" target="_top">免费注册</a>
				</div>
			</div>
		</ul>
		<ul class="message-r">
			<div class="topMessage home">
				<div class="menu-hd"><a href="/user/main" target="_top" class="h">省多多商城</a></div>
			</div>
			<div th:onclick="myAccount([[${userPhone}]])" class="topMessage my-shangcheng">
				<div class="menu-hd MyShangcheng"><a target="_top"><i class="am-icon-user am-icon-fw"></i>[[${userPhone}]]</a></div>
			</div>
			<div class="topMessage mini-cart">
				<div class="menu-hd"><a id="mc-menu-hd" href="/cart/list" target="_top"><i class="am-icon-shopping-cart  am-icon-fw"></i><span>购物车</span><strong id="J_MiniCartNum" class="h">0</strong></a></div>
			</div>
			<div class="topMessage favorite">
				<div class="menu-hd"><a href="/myOrder/list" target="_top"><i class="am-icon-heart am-icon-fw"></i><span>我的订单</span></a></div>
			</div>
		</ul>
	</div>


	<!--悬浮搜索框-->
	<div class="nav white">
		<div class="logo"><img th:src="@{/static/images2/logo.png}" /></div>
		<div class="logoBig">
			<li><img th:src="@{/static/images2/logobig.png}"/></li>
		</div>
		<div class="search-bar pr">
			<a name="index_none_header_sysc" href="#"></a>
			<form action="search.html">
				<input id="searchInput" name="index_none_header_sysc" type="text" placeholder="搜索" autocomplete="off">
				<input id="ai-topsearch" class="submit am-btn" value="搜索" index="1" type="submit">
			</form>
		</div>
	</div>
			<div class="clear"></div>

			<!--购物车 -->
			<div class="concent">
				<div id="cartTable">
					<div class="cart-table-th">
						<div class="wp">
							<div class="th th-chk">
								<div id="J_SelectAll1" class="select-all J_SelectAll">

								</div>
							</div>
							<div class="th th-item">
								<div class="td-inner">商品信息</div>
							</div>
							<div class="th th-price">
								<div class="td-inner">单价</div>
							</div>
							<div class="th th-amount">
								<div class="td-inner">数量</div>
							</div>
							<div class="th th-sum">
								<div class="td-inner">金额</div>
							</div>
							<div class="th th-op">
								<div class="td-inner">操作</div>
							</div>
						</div>
					</div>
					<div class="clear"></div>
					<span th:each="goods:${pageInfo.list}">
					<tr class="item-list">
						<div class="bundle  bundle-last ">
							<div class="bundle-main">
								<ul class="item-content clearfix">
									<li class="td td-chk">
										<div class="cart-checkbox ">
											<input type="checkbox" th:value="${goods.id}" name="k">
										</div>
									</li>
									<li class="td td-item">
										<div >
												<img th:src="'http://localhost:8887/'+ ${goods.imgUrl}" width="150px" height="150px"/></a>
										</div>
										<div class="item-info">
											<div class="item-basic-info">
												<a href="#" target="_blank" title="[[${goods.goodsName}]]" class="item-title J_MakePoint" data-point="tbcart.8.11">[[${goods.goodsName}]]</a>
											</div>
										</div>
									</li>
										<li class="td td-info">
										<div class="item-props item-props-can">
												<span style="color:red">现在活动！！各种商品立减3元</span>
										</div>
									</li>
									<li class="td td-price">
										<div class="item-price price-promo-promo">
											<div class="price-content">
												<div class="price-line">
													<em class="price-original"><span th:text="${goods.goodsPrice}+3"></span></em>
												</div>
												<div class="price-line">
													<em class="J_Price price-now" tabindex="0">[[${goods.goodsPrice}]]</em>
												</div>
											</div>
										</div>
									</li>
									<li class="td td-amount">
										<div class="amount-wrapper ">
											<div class="item-amount ">
											<div style="width: 160px">
                                                  <input style="width: 50px; height: 38px; border: 2px white; float: left;" type="button" value="-" th:onclick="reductionOf(this,[[${goods.goodsId}]])" />
												  <input style="text-align: center; width: 50px; height: 32px; float: left;" type="text" th:value=" ${goods.buyCount}" th:onblur="checkNumber(this,[[${goods.goodsId}]])" />
												  <input style="width: 50px; height: 38px; border: 2px white;" type="button" value="+" th:onclick="add(this,[[${goods.goodsId}]])" />
											</div>
											</div>
										</div>
									</li>
									<li class="td td-sum">
										<div class="td-inner">
											<span th:text="${goods.goodsPrice}*${goods.buyCount}"></span>
										</div>
									</li>
									<li class="td td-op">
										<div class="td-inner">
											<a title="移入收藏夹" class="btn-fav" href="#" th:onclick="buy([[${goods.id}]])">购买</a>
											<a href="javascript:;" data-point-url="#" class="delete" th:onclick="del([[${goods.id}]])">删除</a>
										</div>
									</li>
								</ul>
							</div>
						</div>
					</tr>
					</span>
					<div class="clear"></div>
				</div>
				<div class="clear"></div>

				<div class="float-bar-wrapper">
					<div id="J_SelectAll2" class="select-all J_SelectAll">
						<div class="cart-checkbox">
								<input type="checkbox" onclick="checkAll(this)">
						</div>
						<span>全选</span>
					</div>
					<div class="float-bar-right">
						<div class="price-sum">
							<span class="txt">合计:</span>
							<strong class="price">¥<em id="J_Total">0.00</em></strong>
						</div>
						<div class="btn-area">
								<span onclick="getAllChecked()">结&nbsp;算</span></a>
						</div>
					</div>

				</div>
			</div>
	<div style="text-align:center;">
		<button class="layui-btn" onclick="jump(1)">首页</button>
		<button class="layui-btn" th:onclick="jump([[${pageInfo.pageNum-1}]])">上一页</button>
		<span th:text="${pageInfo.pageNum} + '/' + ${pageInfo.pages} + '页'"></span>
		<button class="layui-btn" th:onclick="jump([[${pageInfo.pageNum+1}]])">下一页</button>
		<button class="layui-btn" th:onclick="jump([[${pageInfo.pages}]])">尾页</button>
	</div>
	</body>
<script>
	       function jump(pageNum) {
			var url = "list?pageNum=" + pageNum;
			window.location.href = url;
		}

     //减数量
	function reductionOf(obj,goodsId) {
                //减前判断
		if ($(obj).next().val() == '') {
			$(obj).next().val(1);
		}
		if($(obj).next().val()==0){
			$(obj).next().val(1);
		}
		$(obj).next().val(parseInt($(obj).next().val()) - 1);//数值减
		$(obj).next().val($(obj).next().val());//赋值给框
		var buyCount=$(obj).next().val();
		window.location.href="/cart/upCount?goodsId="+goodsId+"&buyCount="+buyCount;
	};
        //加数量
	function add(obj,goodsId) {
                //加前判断
		if ($(obj).prev().val() == '') {
			$(obj).prev().val(1);
		}
		$(obj).prev().val(parseInt($(obj).prev().val()) + 1);//数值加
		$(obj).prev().val($(obj).prev().val());//赋值给框
        var buyCount=$(obj).prev().val();
		window.location.href="/cart/upCount?goodsId="+goodsId+"&buyCount="+buyCount;
	};
	//校验数字格式（只能输入正整数）
	function checkNumber(obj,goodsId) {
		var reg = /^[1-9]\d*$/;
		if(!reg.test($(obj).val()) || $(obj).val()==''){
			$(obj).val(1);
		}
		   var buyCount=$(obj).val();
		window.location.href="/cart/upCount?goodsId="+goodsId+"&buyCount="+buyCount;
}

  function del(id){
  	if (confirm("确定要删除该信息吗？删除将不能恢复！")) {
				$.ajax({
					url: "/cart/del",
					type: "post",
					data: "id=" + id,
					//请求发送完之后的回调函数
					success: function(info) {
						console.info(info);
						if (info == 1) {
							alert("删除成功！");
						} else {
							alert("删除失败！");
						}
						window.location.href="/cart/list";
					}
				});
				return true;
			} else
				return false;
		}
<!--全选全不选-->
function checkAll(obj) {
			var a = $(obj).prop("checked"); //true 和 false
			if (a) {
				$(":checkbox[name='k']").prop("checked", true);
			} else {
				$(":checkbox[name='k']").prop("checked", false);
			}
		}

			//购买多个商品
		function getAllChecked() {
			var es = $(":checkbox[name='k']:checked");
			var params = "";
			$.each(es, function(index, item) {
				console.info(item.value);
				params += item.value + ",";
			})
			if (params.length == 0) {
				alert("请选中购买商品！");
			} else {
				window.location.href = "/cart/emptyCart?ids=" + params.substr(0, params.length - 1);
				alert("进入订单支付！");

			}
		}
		function buy(id){
        window.location.href = "/cart/emptyCart?ids=" + id ;
		}
<!--点击b2商城跳转主页-->
    function zhuye(){
    window.location.href = "/user/main"
    }
     <!--跳转购物车-->
    function cart(){
    window.location.href = "/cart/list"
    }
     <!--跳转我的订单-->
    function myOrder(){
    window.location.href = "/myOrder/list"
    }
    function myAccount(userPhone){
    window.location.href = "/user/myAccount?userPhone="+userPhone;
    }
</script>
</html>